
const glob = require('glob');
const path = require('path');

const miniCssExtractPlugin = require('mini-css-extract-plugin');
const autoprefixer = require('autoprefixer');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const FriendlyErrorsWebpckPlugin = require('friendly-errors-webpack-plugin');

const projectRoot = process.cwd();

const setMPA = () => {
    const entry = {};
    const htmlWebpackPlugins = [];

    const entryFiles = glob.sync(path.join(__dirname, './src/*/index.js'));
    // console.log('entryFiles',entryFiles);

    Object.keys(entryFiles)
        .map((index) => {
            const entryFile = entryFiles[index];

            const match = entryFile.match(/src\/(.*)\/index\.js/);
            const pageName = match && match[1];

            entry[pageName] = entryFile;

            return htmlWebpackPlugins.push(
                new HtmlWebpackPlugin({
                    template: path.join(__dirname, `./src/${pageName}/index.html`),
                    filename: `${pageName}.html`,
                    chunk: ['vendors', pageName],
                    inject: true,
                    minify: {
                        html5: true,
                        collapseWhitespace: true,
                        preserveLineBreaks: false,
                        minifyCSS: true,
                        removeComments: false,
                    },
                }),
            );
        });
    return {
        entry,
        htmlWebpackPlugins,
    };
};

const { entry, htmlWebpackPlugins } = setMPA();
module.exports = {
    entry,
    // output:{
    //     path:path.resolve(__dirname,'dist'),
    //     filename:'[name]_[chunkhash:8].js'
    // },
    module: {
        rules: [
            {
                test: /\.js$/,
                use: ['babel-loader', 'eslint-loader'],
            },
            {
                test: /\.css$/,
                use: [
                    miniCssExtractPlugin.loader,
                    'css-loader'],
            },
            {
                test: /\.less$/,
                use: [
                    miniCssExtractPlugin.loader,
                    'css-loader',
                    'less-loader',

                    {
                        loader: 'postcss-loader',
                        options: {
                            plugins: () => [
                                autoprefixer(),
                            ],
                        },
                    },
                    {
                        loader: 'px2rem-loader',
                        options: {
                            remUnit: 75, // rem相对px的转换单位 1 rem = 75px
                            remPrecision: 8, // px转rem 小数点位数
                        },
                    },
                ],
            },
            {
                test: /\.(png|svg|jpg|gif)$/,
                use: [{
                    loader: 'file-loader',
                    options: {
                        name: '[name]_[hash:8].[ext]',
                    },
                }],
            },
            {
                test: /\.(woff|woff2|eot|ttf|otf)$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: '[name]_[hash:8].[ext]',
                        },
                    },
                ],
            },
        ],
    },
    plugins: [
        new CleanWebpackPlugin(),
        new FriendlyErrorsWebpckPlugin(),
        function errorsPlugin() {
            this.hooks.done.tap('done', (stats) => {
                if (stats.compliation.errors && stats.compilation.error.length && process.argv.indexOf('--watch') === -1) {
                    console.log('build error');// eslint-disable-line
                    process.exit(-1);
                }
            });
        },
        // ,new htmlWebExternalPlugin({
        //     externals:[
        //         {
        //             module:'react',
        //             entry:'https://unpkg.com/react@16/umd/react.production.min.js',
        //             global:'React'
        //         },
        //         {
        //             module:'react-dom',
        //             entry:'https://unpkg.com/react-dom@16/umd/react-dom.production.min.js',
        //             global:'ReactDOM'
        //         }
        //     ]
        // })
    ].concat(htmlWebpackPlugins),

    //  devtool:'inline-source-map',
    stats: 'errors-only',
    // mode:"production"


};
